<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>${survey.title}</title>
    <link rel="stylesheet" href="/static/lib/layui-src/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/css/question.css" media="all">

    <style>
        .bg {
            background-image: url("/upload/${survey.bgimg}");
            background-size: 100% 100%;
        }

        .surveytitle {
            color: black;
            font-size: 23px;
            text-align: center;
            margin-top: 5px;

        }

        .surveyremark {
            color: #8c8c8c;
            font-size: 16px;
            text-align: center;
            margin-top: 5px;
        }

    </style>
</head>
<body>
<div class="layuimini-container bg"
     style="position: absolute;bottom: 0px;top:0px;left: 0px;right:0px;margin: 0px;">

    <div class="preview" id="preview" style="overflow: auto">
        <ul class="content">
            <div class="surveytitle">
                ${survey.title}
            </div>
            <div class="surveyremark">
                ${survey.remark}
            </div>
            <c:forEach items="${survey.questions}" var="question" varStatus="index">
                <c:if test="${question.type==1 or question.type==2}">

                    <div class="radioTemplate spliter">
                        <li class="using radio">
                            <input type="hidden" name="questionId"  xtype="${question.type}" value="${question.id}">

                            <div class="title">
                                <div class="no_edit"><strong>${(index.index+1)}、${question.title}</strong></div>
                                <c:if test="${question.remark != null && question.remark != ''}">
                                    <div class="no_edit">${question.remark}</div>
                                </c:if>
                            </div>

                            <div class="options">
                                <ul>
                                    <c:forEach items="${question.options}" var="options">
                                        <li>
                                            <table>
                                                <tr>
                                                    <td>
                                                        <c:if test="${options.type == 1}"><input type="radio"
                                                                                                 class="myselect"
                                                                                                 name="r${question.id}"
                                                                                                 value="${options.id}"></c:if>
                                                        <c:if test="${options.type == 2}"><input type="checkbox"
                                                                                                 class="myselect"
                                                                                                 name="r${question.id}"
                                                                                                 value="${options.id}"> </c:if>
                                                    </td>
                                                    <td style="width: 560px">
                                                            ${options.opt}
                                                    </td>
                                                    <td>${options.num}/${totle}</td>
                                                </tr>
                                            </table>
                                        </li>
                                    </c:forEach>
                                </ul>
                            </div>
                        </li>
                    </div>
                </c:if>
<%--                <c:if test="${question.type==3 or question.type==4}">--%>
<%--                    <div class="inputTemplate spliter">--%>
<%--                        <li class="using inputx">--%>
<%--                            <input type="hidden" name="questionId"  xtype="${question.type}" value="${question.id}">--%>

<%--                            <div class="title">--%>
<%--                                <div class="no_edit"><strong>${(index.index+1)}、${question.title}</strong></div>--%>
<%--                                <c:if test="${question.remark != null && question.remark != ''}">--%>
<%--                                    <div class="no_edit">${question.remark}</div>--%>
<%--                                </c:if>--%>
<%--                            </div>--%>
<%--                            <div>--%>
<%--                                <c:if test="${question.type == 3}">--%>
<%--                                    <input type="text" class="inputx" id="r${question.id}">--%>
<%--                                </c:if>--%>
<%--                                <c:if test="${question.type == 4}">--%>
<%--                                    <textarea class="mytext" id="r${question.id}"></textarea>--%>
<%--                                </c:if>--%>
<%--                            </div>--%>
<%--                        </li>--%>
<%--                    </div>--%>
<%--                </c:if>--%>
            </c:forEach>
            <li style="text-align: center;margin: 5px">
                <button class="layui-btn returns">返回</button>
            </li>

        </ul>

    </div>


</div>


<script src="/static/lib/layui-src/layui.js" charset="utf-8"></script>
<script src="/static/js/lay-config.js" charset="utf-8"></script>
<script>
    layui.use(['jquery', 'layer'], function () {
        var $ = layui.jquery, layer = layui.layer;
        $('.returns').click(function () {

            window.location.href="/record/page";
        });
    });


</script>
</body>
</html>